<template>
	<view class="order_msg_info_com">
		<view class="order_msg_info">
			<view class="title">{{$t('locales.orderInformation')}}</view>
			<view class="info_item">
				<view class="name">{{$t('locales.orderRemarks')}}</view>
				<view class="val">{{ value.remarks }}</view>
			</view> 
			<!-- 支付方式 -->
			<view class="info_item" v-if="value.payMethodName">
				<view class="name">{{$t('locales.paymentMethod')}}</view>
				<view class="val">{{ value.payMethodName }}</view>
			</view>
			<view class="info_item">
				<view class="name">{{$t('locales.orderNumber')}}</view>
				<view class="val">{{ value.orderNo }}</view>
			</view>
			<view class="info_item">
				<view class="name">{{$t('locales.orderTime')}}</view>
				<view class="val">{{ value.orderCreateTime }}</view>
			</view>
			<!-- 支付时间 -->
			<view class="info_item" v-if="value.payTime">
				<view class="name">{{$t('locales.paymentTime')}}</view>
				<view class="val">{{ value.payTime }}</view>
			</view>
			<!-- 商品资质审核意见 -->
			<view class="info_item" v-if="value.orderCommonGoodsQua && value.orderCommonGoodsQua.opinion">
				<view class="name">{{$t('locales.auditOpinion')}}</view>
				<view class="val">{{ value.orderCommonGoodsQua.opinion }}</view>
			</view>
			<!-- 付款凭证审核意见 -->
			<view class="info_item" v-if="value.orderCommonPayVou && value.orderCommonPayVou.opinion">
				<view class="name">{{$t('locales.auditOpinion')}}</view>
				<view class="val">{{ value.orderCommonPayVou.opinion }}</view>
			</view>
			<view class="info_item" v-if="value.orderCancelRemarks">
				<view class="name">{{$t('locales.reasonRefund')}}</view>
				<view class="val">{{ value.orderCancelRemarks }}</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	props: {
		value: {
			type: Object,
			default: () => {}
		}
	},
	data() {
		return {}
	}
}
</script>

<style lang="scss" scoped>
.order_msg_info_com {
	margin-bottom: 20rpx;
	.order_msg_info {
		border-radius: 12rpx;
		overflow: hidden;
		margin-top: 20rpx;
		background-color: #fff;
		.title {
			padding: 20rpx 30rpx;
			border-bottom: 1px solid #eee;
		}
		.info_item {
			display: flex;
			min-height: 80rpx;
			padding: 20rpx 30rpx;
			border-bottom: 1px solid #eee;
			.name {
				width: 180rpx;
				color: #777777;
			}
			.val {
				width: 450rpx;
				text-align: right;
				overflow: hidden;
			}
		}
	}
}
</style>
